<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h3>『源A』可以给『源B』发请求，但是无法获取『源B』响应的数据。</h3>
    <ul>
        <li>跨域限制仅存在浏览器端，服务端不存在跨域限制。</li>
        <li>即使跨域了，Ajax 请求也可以正常发出，但响应数据不会交给开发者。</li>
        <li> [link] [script] [img] 这些标签发出的请求也可能跨域，只不过浏览器对标签跨域不做严格限制，对开发几乎无影响。 </li>
    </ul>
    <button id="btn" onclick="showDOM()"> 获取数据</button>
    <script type="text/javascript">

        async function showDOM() {
            const url = 'https://www.toutiao.com/hot-event/hot-board/?origin=toutiao_pc'
            let result = await fetch(url)
            let data = await result.json();
            console.log(data)
        }

    </script>
</body>

</html>